<template>
	<view>
		<view class="m_header_top">
			<my-top :title="title" @submit='submit'></my-top>
		</view>
		<view class="relation ">
			<view class="itembox" @click="changerole(item)" v-for="(item,index) in relationlist" :key='index'>
				<text class="borders" :class="item.code == checkid.code?'checkborders':''"></text>
				<text class="title">{{item.name}}</text>
				<!-- <text class="distraction">{{item.distraction}}</text> -->
			</view>
		</view>
	</view>
</template>

<script>
	import {
		selectallrelation
	} from "@/api/api.js";
	import {
		mapState,
	} from 'vuex';
	import {formModule } from '@/utils/formdata.js'
	var fromdata = new formModule();
	export default {
		data() {
			return {
				title:'选择您与宝宝关系',
				checkid:{
					code:''
				},
				relationlist:[
				],
				userdata:{},
			};
		},
		async onLoad(e) {
			let data = JSON.parse(e.data);
			this.userdata  = data;
			if(data.code){
				this.checkid.code = data.code;
			}
			console.log(data)
			uni.showLoading({
				title:'加载中'
			})
			let result = await selectallrelation({pageNum:1,pageSize:100,userId:this.currentUser.userId});
			result = fromdata.formatDate(result);
			this.relationlist = result.list;
			uni.hideLoading()
		},
		computed:{
			...mapState('initData', {
				// scheduleList: state => state.scheduleList,
				currentUser: state => state.currentUser,
			}),
		},
		methods:{
			submit(val){
				let arr =  this.relationlist.filter(item=>item.code == this.checkid.code);
				if(arr.length>0){
					let obj = {
						name:arr[0].name,
						code:arr[0].code
					}
					uni.setStorageSync('checkrelation',obj);
					uni.navigateBack({
						delta:1
					})
				}
				console.log(arr)
				
				
				
				
				// uni.redirectTo({
				// 	url:this.userdata.url +'?title=' + this.checkid.name +'&relationId='+this.checkid.code
				// })
			},
			changerole(val){
				console.log(val)
				this.checkid = val;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.relation{
		padding:32rpx 16rpx;
		background: #FFFFFF;
		height: 100%;
		.itembox{
			height:86rpx;
			
			opacity: 1;
			display: flex;
			align-items:center;
			padding: 0 16rpx;
			box-sizing: border-box;
			border-bottom: 1rpx solid rgba(0,0,0,.1);
			.borders {
				width: 19rpx;
				height: 19rpx;
				border: 2rpx solid #5555ff;
				border-radius: 50%;
				opacity: 1;
				margin-right: 16rpx;
			}
			
			.checkborders {
				border: 2rpx solid #5555ff;
				background-color: #5555ff;
			}
			.title{
				height: 40rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 400;
				line-height: 42rpx;
				color: #707070;
				opacity: 1;

			}
		}
	}
</style>
